<template>
  <div class="actions-box bg-white">
    <div class="custom-button" @click="handleSetRemark">设置备注和标签</div>
    <div class="custom-button" @click="handleSetPermissions">设置朋友权限</div>
    <n-divider style="margin: 0;" />
    <div class="custom-button">把他推荐给朋友</div>
    <n-divider style="margin: 0;" />
    <div class="custom-button">设为星标朋友</div>
    <div class="custom-button">加入黑名单</div>
    <n-divider style="margin: 0;" />
    <div class="custom-button danger-button">删除</div>
  </div>
</template>

<script setup>
import { useWindow } from "@/hooks/useWindow.js";
const { createWindow, getWindowByRoute } = useWindow();

// 设置备注和标签
const handleSetRemark = async() => {
  await createWindow('contact/setRemarkAndTag', {
    title: '设置备注和标签',
    decorations: false,
    width: 400,
    height: 500,
    parent: getWindowByRoute('chat'),
    // modal: true
  });
};

// 设置朋友权限
const handleSetPermissions = async() => {
  await createWindow('contact/setPermissions', {
    title: '设置朋友权限',
    decorations: false,
    width: 300,
    height: 400,
    parent: getWindowByRoute('chat'),
  });
}
</script>

<style lang="scss" scoped>
.actions-box {
  padding: 4px 8px;
  border-radius: 4px;
}

.custom-button {
  line-height: 22px;
}

.danger-button {
  color: #f96464;
  &:hover {
    background-color: #ed4c4c;
    color: white;
  }
}
</style>
